
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>

<style>
	*{ padding:0; margin:0; list-style:none;}
	.tab{ width:200px; height:200px;}
	.tab input{float:left;}
	.tab .active{ background:red; color:#FFF;}
	.tab li{ width:200px; height:176px;border: 1px solid #333;text-align:center; line-height:176px;display:none;}
	.tab .show{ display:block;}
	.tab section{ overflow:hidden;}
</style>

</head>

<body>
	<div class="tab" id="tab">
    	<section class="btnBox">
        	<input class="active" type="button" value="按钮1" />
            <input type="button" value="按钮2" />
            <input type="button" value="按钮3" />
        </section>
        <ul>
        	<li class="show">1</li>
            <li>2</li>
            <li>3</li>
        </ul>
    </div>
    
    <script src="bundle.js"></script>

</body>
</html>











